const { defineConfig } = require('@vue/cli-service')
const path = require('path')
const resolve = dir => path.join(__dirname, dir)
const AutoImport = require('unplugin-auto-import/webpack')
const Components = require('unplugin-vue-components/webpack')
const { ElementPlusResolver } = require('unplugin-vue-components/resolvers')

const MonacoWebpackPlugin = require('monaco-editor-webpack-plugin')

module.exports = defineConfig({
  // 基本路径
  publicPath: './',
  // 输出文件目录
  outputDir: 'dist',
  // eslint-loader 是否在保存的时候检查
  lintOnSave: true,
  // webpack配置别名
  chainWebpack: config => {
    config.resolve.alias.set('@', resolve('src'))
  },
  devServer: {
    port: 3003,
    open: true,
    hot: true,
    host: 'localhost',
    proxy: {
      '/':{
        ws:false,
        target:'http://127.0.0.1:3002/',
        changeOrigin:true
      }
    }
  },
//zaina xie laizhe? xian zai bu tui jian yong yarn le, yin wei yarn gen npm cha bu duo le
// qud ding zhe me pei ? ni tian csdn
  transpileDependencies: true,
  // webpack.base.conf.js
  // scss 全局变量的配置
  css: {
    loaderOptions: {
      scss: {
        additionalData: '@import "./src/styles/variable.scss";'
      }
    }
  },
  configureWebpack: {
    plugins: [
      AutoImport({
        resolvers: [ElementPlusResolver()]
      }),
      Components({
        resolvers: [ElementPlusResolver()]
      }),
      new MonacoWebpackPlugin()
    ]
  }
})
